<template>
	<a-modal :title="title" :width="1800" :visible="visible" :confirmLoading="confirmLoading" :footer="null"
		@ok="handleSubmit" @cancel="handleCancel">

		<a-spin :spinning="confirmLoading">
			<a-form layout="inline" labelAlign="left">
				<a-row :gutter="10">
					<a-col :md="6" :sm="24">
						<a-form-item label="单据日期">
							<a-range-picker :value-format="'YYYY-MM-DD HH:mm:ss'" style="width: 300px;" v-model="createTime"
								@change="TimeOk1" />
						</a-form-item>
					</a-col>
					<a-col :md="6" :sm="24">
						<a-form-item label="入库单号">
							<a-input v-model="queryParam.orderNumber" style="width: 300px;" placeholder="请输入" />
						</a-form-item>
					</a-col>
					<a-col :md="6" :sm="24">
						<a-form-item label="供应商名称">
							<a-input v-model="queryParam.orgIdSupplierName" style="width: 300px;" placeholder="请输入" />
						</a-form-item>
					</a-col>
					<a-col :md="6" :sm="24">
						<a-form-item label="入库 日期">
							<a-range-picker :value-format="'YYYY-MM-DD HH:mm:ss'" style="width: 300px;" v-model="rkTime"
								@change="TimeOk2" />
						</a-form-item>
					</a-col>
					<a-col :md="6" :sm="24">
						<a-form-item label="采购单号">
							<a-input v-model="queryParam.cgOrderNumber" style="width: 300px;" placeholder="请输入" />
						</a-form-item>
					</a-col>
					<a-col :md="6" :sm="24">
						<a-form-item label="料 号">
							<a-input v-model="queryParam.materialCode" style="width: 300px;" placeholder="请输入" />
						</a-form-item>
					</a-col>
					<a-col :md="6" :sm="24">
						<a-form-item label="物料名称">
							<a-input v-model="queryParam.materialName" style="width: 300px;" placeholder="请输入" />
						</a-form-item>
					</a-col>
					<a-col :md="6" :sm="24">
						<a-form-item label="对账状态">
							<a-select default-value="" placeholder="全部" style="width: 300px;" v-model="queryParam.executeStatus">
								<a-select-option :value="1">
									待对账
								</a-select-option>
								<a-select-option :value="2">
									已对账
								</a-select-option>
							</a-select>
						</a-form-item>
					</a-col>
					<a-col :md="24" :sm="24" style="text-align: right;margin: 20px 0px;">
						<div style="margin-right: 50px;">
							<a-button v-if="currentType == 'init'" type="primary" @click="toReconciliationEnd"
								:disabled="btnDisabled">对账完成</a-button>
							<a-button type="primary" @click="$refs.table.refresh()">搜索</a-button>
							<a-button v-if="currentType == 'init'"
								@click="() => { queryParam = { reconciliationOrderId: reconciliationOrderId }; rkTime = null; createTime = null; $refs.table.refresh(); }">重置</a-button>
							<Export text="导出" title="对账明细" url="/emsReconciliationOrderMaterial/export" :obj="{
								reconciliationOrderId: queryParam.reconciliationOrderId,
								orderNumber: queryParam.orderNumber,
								orgIdSupplierName: queryParam.orgIdSupplierName,
								djStartTime: queryParam.djStartTime,
								djEndTime: queryParam.djEndTime,
								rkStartTime: queryParam.rkStartTime,
								rkEndTime: queryParam.rkEndTime,
								cgOrderNumber: queryParam.cgOrderNumber,
								materialCode: queryParam.materialCode,
								materialName: queryParam.materialName,
								executeStatus: queryParam.executeStatus,
							}" />
							<a-button v-if="currentType == 'init'" type="primary" @click="toReconciliation" :disabled="btnDisabled">对账</a-button>
						</div>
					</a-col>
				</a-row>
			</a-form>
			<div style="margin-top: 10px;">
				<s-table ref="table" :scroll="{ x: 1400 }" size="default" :columns="columns" :data="loadData" :alert="true"
					:rowKey="(record) => record.orderMaterialId"
					:rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }">
					<span slot="executeStatus" slot-scope="text,record">
						<span v-if="record.executeStatus == 1">待对账</span>
						<span v-if="record.executeStatus == 2" style="color: #0BA122;">已对账</span>
					</span>
				</s-table>
			</div>
		</a-spin>
	</a-modal>
</template>

<script>
import { STable } from '@/components'
import {
	emsReconciliationOrderMaterialPage,
	reconciliation,//对账
	reconciliationEnd,//对账完成
} from '@/api/modular/main/bill'

export default {
	components: {
		STable
	},
	data() {
		return {
			labelCol: {
				xs: { span: 24 },
				sm: { span: 8 }
			},
			wrapperCol: {
				xs: { span: 24 },
				sm: { span: 16 }
			},
			visible: false,
			confirmLoading: false,
			form: this.$form.createForm(this),
			queryParam: {},  // 查询参数
			rkTime: null,
			createTime: null,
			columns: [       // 表头
				{
					title: '序号', width: '80px',
					dataIndex: 'materialId',
					customRender: (text, record, index) => `${index + 1}`,
				},
				{
					title: '入库单号',
					dataIndex: 'orderNumber'
				},
				{
					title: '供应商名称',
					dataIndex: 'orgIdSupplierName'
				},
				{
					title: '单据日期',
					dataIndex: 'createTime'
				},
				{
					title: '入库日期',
					dataIndex: 'rkTime'
				},
				{
					title: '对账状态',
					dataIndex: 'executeStatus',
					// customRender: (text, record, index) => record.executeStatus == 1 ? '待对账' : '已对账',
					scopedSlots: { customRender: 'executeStatus' }
				},
				{
					title: '采购单号',
					dataIndex: 'cgOrderNumber'
				},
				{
					title: '料号',
					dataIndex: 'materialCode'
				},
				{
					title: '物料名称',
					dataIndex: 'materialName'
				},
				{
					title: '仓库',
					dataIndex: 'orgIdStorehouseName'
				},
				{
					title: '单位',
					dataIndex: 'unit'
				},
				{
					title: '数量',
					dataIndex: 'number'
				},
				{
					title: '成本价(元)',
					dataIndex: 'costPrice'
				},
				{
					title: '含税单价(元)',
					dataIndex: 'purchasePrice'
				},
				{
					title: '税率',
					dataIndex: 'taxRate'
				},
				{
					title: '税额',
					dataIndex: 'taxAmount'
				},
				{
					title: '价税合计',
					dataIndex: 'purchaseTotalPrice'
				},
				{
					title: '备注',
					dataIndex: 'remark'
				}
			],
			sourceData: [],
			// 加载数据方法 必须为 Promise 对象
			loadData: parameter => {
				return emsReconciliationOrderMaterialPage(Object.assign(parameter, this.queryParam)).then((res) => {
					return res.data
				})
			},
			selectedRowKeys: [],
			selectedRows: [],
			defaultExpandedKeys: [],
			reconciliationOrderId: null,
			btnDisabled: false,//按钮禁用
			currentType: "",
		}
	},
	methods: {
		init(record) {
			let _this = this
			this.visible = true;
			this.title = "对账";
			this.currentType = "init";
			console.log(record);
			this.btnDisabled = false;
			this.reconciliationOrderId = record.reconciliationOrderId;
			this.queryParam = {};
			this.queryParam.reconciliationOrderId = record.reconciliationOrderId
			setTimeout(() => {
				_this.$refs.table.refresh()
			}, 100)
		},
		details(record) {
			let _this = this
			this.visible = true;
			this.title = "详情";
			this.currentType = "details";
			this.btnDisabled = false;
			this.reconciliationOrderId = record.reconciliationOrderId;
			this.queryParam = {};
			this.queryParam.reconciliationOrderId = record.reconciliationOrderId
			setTimeout(() => {
				_this.$refs.table.refresh()
			}, 100)
		},
		handleSubmit() {
		},
		/**
		 * 单据日期
		 * @param value 
		 */
		TimeOk1(value) {
			console.log(value);

			this.queryParam.djStartTime = value[0].split(" ")[0] + " 00:00:00";
			this.queryParam.djEndTime = value[1].split(" ")[0] + " 23:59:59";
		},
		/**
		 * 入库时间
		 * @param value 
		 */
		TimeOk2(value) {
			this.queryParam.rkStartTime = value[0].split(" ")[0] + " 00:00:00";
			this.queryParam.rkEndTime = value[1].split(" ")[0] + " 23:59:59";
		},
		/**
		 * 对账
		 */
		toReconciliation() {
			if (this.selectedRowKeys.length == 0) {
				this.$message.error("请选择对账数据！");
				return
			}
			console.log(this.selectedRowKeys);
			let index = this.selectedRows.filter(value => value.executeStatus == 2);
			// console.log("this.selectedRows", this.selectedRowKeys.map(value => { return value.reconciliationOrderMaterialId }));
			if (index.length > 0) {
				this.$message.error("已对账的数据不能再次对账");
				return
			}
			let reconciliationOrderMaterialIds = [];
			this.selectedRows.forEach(val => {
				console.log(val);
				reconciliationOrderMaterialIds.push(val.reconciliationOrderMaterialId);
			})
			console.log(reconciliationOrderMaterialIds);

			// return
			reconciliation({
				reconciliationOrderId: this.queryParam.reconciliationOrderId,
				reconciliationOrderMaterialIds: reconciliationOrderMaterialIds
			}).then(res => {
				this.$message.success("对账成功");
				this.handleOk();
			})
		},
		/**
		 * 对账完成
		 */
		toReconciliationEnd() {
			this.$confirm({
				title: '提示',
				content: '确认对账已完结?',
				onOk: () => {
					reconciliationEnd({
						reconciliationOrderId: this.queryParam.reconciliationOrderId,
					}).then(res => {
						if (res.code == 200) {
							this.$message.success("对账已完结");
							this.handleOk();
							this.$emit("ok");
							this.btnDisabled = true;
						}
					})
				},
				onCancel() {
				}
			})

		},
		onSelectChange(selectedRowKeys, selectedRows) {
			this.selectedRowKeys = selectedRowKeys
			this.selectedRows = selectedRows
		},
		handleOk() {
			this.$refs.table.refresh()
			this.$refs.table.clearSelected();
			this.selectedRowKeys = []
			this.selectedRows = []
		},
		handleCancel() {
			this.form.resetFields()
			this.visible = false
		}
	}
}
</script>
